<!DOCTYPE html>
<html class="no-js" lang="" xmlns:th="http://www.thymeleaf.org" xmlns:v-for="http://www.w3.org/1999/xhtml"
      xmlns:v-on="http://www.w3.org/1999/xhtml" xmlns:v-bind="http://www.w3.org/1999/xhtml">

<head>
    <!-- Meta Data -->
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>统计年鉴</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Favicon -->
    <link rel="shortcut icon" type="image/x-icon" href="media/favicon.png">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="dependencies/bootstrap/css/bootstrap.min.css">
    <!-- FontAwesome CSS -->
    <link rel="stylesheet" href="dependencies/fontawesome/css/all.min.css">
    <!-- Flaticon CSS -->
    <link rel="stylesheet" href="dependencies/flaticon/flaticon.css">
    <!-- Owl Carousel CSS -->
    <link rel="stylesheet" href="dependencies/owl.carousel/css/owl.carousel.min.css">
    <link rel="stylesheet" href="dependencies/owl.carousel/css/owl.theme.default.min.css">
    <!-- Animated Headlines CSS -->
    <link rel="stylesheet" href="dependencies/jquery-animated-headlines/css/jquery.animatedheadline.css">
    <!-- Magnific Popup CSS -->
    <link rel="stylesheet" href="dependencies/magnific-popup/css/magnific-popup.css">
    <!-- Animate CSS -->
    <link rel="stylesheet" href="dependencies/animate.css/css/animate.min.css">
    <!-- Meanmenu CSS -->
    <link rel="stylesheet" href="dependencies/meanmenu/css/meanmenu.min.css">
    <!-- Site Stylesheet -->
    <link rel="stylesheet" href="assets/css/app.css">

    <!-- Google Web Fonts -->
    <link href="https://fonts.googleapis.com/css?family=Nunito:300,300i,400,400i,600,600i,700,700i,800,800i&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i,900,900i&display=swap" rel="stylesheet">

</head>

<body class="sticky-header">
<!--[if lte IE 9]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
<![endif]-->
<!-- ScrollUp Start Here -->
<a href="#wrapper" data-type="section-switch" class="scrollup">
    <i class="fas fa-angle-double-up"></i>
</a>
<!-- ScrollUp End Here -->
<!-- Preloader Start Here -->
<div id="preloader"></div>
<!-- Preloader End Here -->
<div id="wrapper" class="wrapper">

    <!--=====================================-->
    <!--=            Header Start           =-->
    <!--=====================================-->
    <header class="header">
        <div id="rt-sticky-placeholder"></div>
        <div id="header-menu" class="header-menu menu-layout2">
            <div class="container">
                <div class="row d-flex align-items-center">
                    <div class="col-lg-2">
                        <div class="logo-area">
                            <a href="/" class="temp-logo">
                                <img src="media/logo.png" alt="logo" class="img-fluid">
                            </a>
                        </div>
                    </div>
                    <div class="col-lg-7 d-flex justify-content-end">
                        <nav id="dropdown" class="template-main-menu">
                            <ul>
                                <li>
                                    <a href="/" class="btn-outline-dark">主页</a>
                                </li>
                                <li>
                                    <a href="/area" class="btn-outline-dark">地区差异</a>
                                </li>
                                <li>
                                    <a href="/year" class="btn-outline-dark">年度变化</a>
                                </li>
                                <li>
                                    <a href="/websites" class="btn-outline-dark">相关网站</a>
                                </li>
                                <li>
                                    <a href="/news" class="btn-outline-dark">相关新闻</a>
                                </li>
                            </ul>
                        </nav>
                    </div>
                    <div class="col-lg-3 d-flex justify-content-end">
                        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1" style="display: contents">
                            <ul class="nav navbar-nav navbar-right">
                                <li class="dropdown" th:if="${session.username!=null}">
                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                                       aria-expanded="false">
                                        <span th:text="${session.username}"></span>
                                        <span class="caret"></span>
                                        <!--                            <span th:text="${session.user.getName()}"></span>-->
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li><a href="/manage">管理数据库</a></li>
                                        <li><a href="/logout">退出登录</a></li>
                                    </ul>
                                </li>
                                <li th:if="${session.username==null}">
                                    <a href="/login">登录</a>
                                </li>

                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </header>
    <!--=====================================-->
    <!--=        Inner Banner Start         =-->
    <!--=====================================-->
    <section class="inner-page-banner" data-bg-image="media/banner/banner1.jpg">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="breadcrumbs-area">
                        <h1>数据库管理</h1>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--=====================================-->
    <!--=          Search Box Start         =-->
    <!--=====================================-->
    <section class="bg-accent" id="header1">
        <div class="container">
            <div class="search-box-wrap-layout3">
                <div class="search-box-layout1">
                    <form action="#">
                        <div class="row no-gutters">
                            <div class="col-lg-3 form-group">
                                <div class="input-search-btn search-category">
                                    <i class="fas fa-map-marker-alt"></i>
                                    <label>选择数据表</label>
                                </div>
                            </div>
                            <div class="col-lg-3 form-group">
                                <div class="input-search-btn search-category">
                                    <select id="tableName" v-model="tableSelected" class="custom-select">
                                        <option v-for="(item,i) in tableType" v-bind:value="item.value">{{item.name}}</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-lg-3 form-group">
                                <button class="submit-btn" onclick="submit1()"><i class="fas fa-search"></i>显示</button>
                            </div>
                            <div class="col-lg-3 form-group">
                                <button class="submit-btn" onclick="addRow()"><i class="fas fa-search"></i>新增一行</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </section>
    <!--=====================================-->
    <!--=          Product Start         =-->
    <!--=====================================-->
    <section class="product-inner-wrap-layout1 bg-accent">
        <div class="container">
            <div class="row">
                <div class="col-xl-12 col-lg-12">
                    <div class="product-filter-heading">
                        <div class="row align-items-center">
                            <div class="col-md-6">
                                <h2 class="item-title">Data Table</h2>
                            </div>
                            <div class="col-md-6 d-flex justify-content-md-end justify-content-center">
                                <div class="product-sorting">
                                    <div class="layout-switcher">
                                        <ul>
                                            <li>
                                                <a href="#" data-type="product-box-list" class="product-view-trigger">
                                                    <i class="fas fa-th-list"></i>
                                                </a>
                                            </li>
                                            <li class="active">
                                                <a class="product-view-trigger" href="#" data-type="product-box-grid">
                                                    <i class="fas fa-th-large"></i>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div id="product-view" class="product-box-grid">
                        <div class="row">
                            <div class="col-xl-12 col-md-12">
                                <div class="product-grid-view">
                                    <div class="grid-view-layout1">
                                        <div class="product-box-layout1 top-rated-grid">
                                            <div class="item-img">
                                                <div id="tableDiv" class="tableDiv" style="overflow: auto">
                                                    <table class="table table-bordered table-hover" id="table">
                                                        <thead>
                                                        <tr>
                                                            <th>操作</th>
                                                            <th>年份</th>
                                                            <th>北京</th>
                                                            <th>天津</th>
                                                            <th>河北</th>
                                                            <th>山西</th>
                                                            <th>内蒙</th>
                                                            <th>辽宁</th>
                                                            <th>吉林</th>
                                                            <th>黑龙江</th>
                                                            <th>上海</th>
                                                            <th>江苏</th>
                                                            <th>浙江</th>
                                                            <th>安徽</th>
                                                            <th>福建</th>
                                                            <th>江西</th>
                                                            <th>山东</th>
                                                            <th>河南</th>
                                                            <th>湖北</th>
                                                            <th>湖南</th>
                                                            <th>广东</th>
                                                            <th>广西</th>
                                                            <th>海南</th>
                                                            <th>重庆</th>
                                                            <th>四川</th>
                                                            <th>贵州</th>
                                                            <th>云南</th>
                                                            <th>西藏</th>
                                                            <th>陕西</th>
                                                            <th>甘肃</th>
                                                            <th>青海</th>
                                                            <th>宁夏</th>
                                                            <th>新疆</th>
                                                        </tr>
                                                        </thead>
                                                        <tbody id="tbody">
                                                        <tr th:each="item : ${result}">
                                                            <th style="white-space: nowrap">
                                                                <button onclick="deletetr(this)">删除</button>
                                                                <button onclick="savetr(this)">保存</button>
                                                            </th>
                                                            <td class="year" th:text="${item.year}"></td>
                                                            <td class="beijing" th:text="${item.beijing}"></td>
                                                            <td class="tianjing" th:text="${item.tianjing}"></td>
                                                            <td class="hebei" th:text="${item.hebei}"></td>
                                                            <td class="shanxi" th:text="${item.shanxi}"></td>
                                                            <td class="neimeng" th:text="${item.neimeng}"></td>
                                                            <td class="liaoning" th:text="${item.liaoning}"></td>
                                                            <td class="jilin" th:text="${item.jilin}"></td>
                                                            <td class="heilongjiang" th:text="${item.heilongjiang}"></td>
                                                            <td class="shanghai" th:text="${item.shanghai}"></td>
                                                            <td class="jiangsu" th:text="${item.jiangsu}"></td>
                                                            <td class="zhejiang" th:text="${item.zhejiang}"></td>
                                                            <td class="anhui" th:text="${item.anhui}"></td>
                                                            <td class="fujian" th:text="${item.fujian}"></td>
                                                            <td class="jiangxi" th:text="${item.jiangxi}"></td>
                                                            <td class="shandong" th:text="${item.shandong}"></td>
                                                            <td class="henan" th:text="${item.henan}"></td>
                                                            <td class="hubei" th:text="${item.hubei}"></td>
                                                            <td class="hunan" th:text="${item.hunan}"></td>
                                                            <td class="guangdong" th:text="${item.guangdong}"></td>
                                                            <td class="guangxi" th:text="${item.guangxi}"></td>
                                                            <td class="hainan" th:text="${item.hainan}"></td>
                                                            <td class="chongqin" th:text="${item.chongqin}"></td>
                                                            <td class="sichuan" th:text="${item.sichuan}"></td>
                                                            <td class="guizhou" th:text="${item.guizhou}"></td>
                                                            <td class="yunnan" th:text="${item.yunnan}"></td>
                                                            <td class="xizang" th:text="${item.xizang}"></td>
                                                            <td class="shaanxi" th:text="${item.shaanxi}"></td>
                                                            <td class="gansu" th:text="${item.gansu}"></td>
                                                            <td class="qinhai" th:text="${item.qinhai}"></td>
                                                            <td class="ningxia" th:text="${item.ningxia}"></td>
                                                            <td class="xinjiang" th:text="${item.xinjiang}"></td>
                                                        </tr>

                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--=====================================-->
    <!--=       Footer Start           	=-->
    <!--=====================================-->
    <footer>
        <div class="footer-top-wrap">
            <div class="container">
                <div class="row">
                    <div class="col-lg-3 col-sm-6">
                        <div class="footer-box-layout1">
                            <div class="footer-logo">
                                <img src="media/logo.png" alt="logo">
                            </div>
                            <p>这是一个数据统计可视化网站，主要展示中国近年来的统计数据，以及相关的新闻和网站</p>
                        </div>
                    </div>
                    <div class="col-lg-3 col-sm-6">
                        <div class="footer-box-layout1">
                            <div class="footer-title">
                                <h3>网站制作人</h3>
                            </div>
                            <div class="footer-menu-box">
                                <ul>
                                    <li><a href="#">Silence Li</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-sm-6">
                        <div class="footer-box-layout1">
                            <div class="footer-title">
                                <h3>所属单位</h3>
                            </div>
                            <div class="footer-menu-box">
                                <ul>
                                    <li><a href="#">武汉大学</a></li>
                                    <li><a href="#">遥感信息工程学院</a></li>
                                    <li><a href="#">地理信息工程GIS</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-sm-6">
                        <div class="footer-box-layout1">
                            <div class="footer-title">
                                <h3>联系方式</h3>
                            </div>
                            <div class="footer-menu-box">
                                <ul>
                                    <li><a href="#">QQ：2118656521</a></li>
                                    <li><a href="#">邮箱：</a></li>
                                    <li><a href="#">2118656521@qq.com</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="footer-bottom-wrap">
            <div class="container">
                <div class="row">
                    <div class="col-md-8">
                        <div class="copyright-text">
                            Copyright &copy; Wuhan University All rights reserved.
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    <!--=====================================-->
    <!--=       Modal Start           	 	=-->
    <!--=====================================-->
    <div class="modal fade modal-location" id="modal-location" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <button type="button" class="close modal-close" data-dismiss="modal" aria-label="Close">
                    <span class="fas fa-times" aria-hidden="true"></span>
                </button>
                <div class="location-list">
                    <h4 class="item-title">Location</h4>
                    <ul>
                        <li><a href="#">California</a></li>
                        <li><a href="#">Kansas</a></li>
                        <li><a href="#">Louisiana</a></li>
                        <li><a href="#">New Jersey</a></li>
                        <li><a href="#">New York</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade modal-location" id="modal-category" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <button type="button" class="close modal-close" data-dismiss="modal" aria-label="Close">
                    <span class="fas fa-times" aria-hidden="true"></span>
                </button>
                <div class="location-list">
                    <h4 class="item-title">Category</h4>
                    <ul>
                        <li>
                            <a href="#"><span class="item-icon"><img src="media/category/category5.png" alt="icon"></span>Business &amp; Industry</a>
                        </li>
                        <li>
                            <a href="#"><span class="item-icon"><img src="media/category/category7.png" alt="icon"></span>Cars &amp; Vehicles</a>
                        </li>
                        <li>
                            <a href="#"><span class="item-icon"><img src="media/category/category14.png" alt="icon"></span>Electronics</a>
                        </li>
                        <li>
                            <a href="#"><span class="item-icon"><img src="media/category/category4.png" alt="icon"></span>Health &amp; Beauty</a>
                        </li>
                        <li>
                            <a href="#"><span class="item-icon"><img src="media/category/category18.png" alt="icon"></span>Hobby, Sport &amp; Kids</a>
                        </li>
                        <li>
                            <a href="#"><span class="item-icon"><img src="media/category/category8.png" alt="icon"></span>Home Appliances</a>
                        </li>
                        <li>
                            <a href="#"><span class="item-icon"><img src="media/category/category6.png" alt="icon"></span>Jobs</a>
                        </li>
                        <li>
                            <a href="#"><span class="item-icon"><img src="media/category/category12.png" alt="icon"></span>Others</a>
                        </li>
                        <li>
                            <a href="#"><span class="item-icon"><img src="media/category/category11.png" alt="icon"></span>Pets &amp; Animals</a>
                        </li>
                        <li>
                            <a href="#"><span class="item-icon"><img src="media/category/category3.png" alt="icon"></span>Property</a>
                        </li>
                        <li>
                            <a href="#"><span class="item-icon"><img src="media/category/category1.png" alt="icon"></span>Services</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

</div>
<!-- Jquery Js -->
<script src="dependencies/jquery/js/jquery.min.js"></script>
<!-- Popper Js -->
<script src="dependencies/popper.js/js/popper.min.js"></script>
<!-- Bootstrap Js -->
<script src="dependencies/bootstrap/js/bootstrap.min.js"></script>
<!-- Waypoints Js -->
<script src="dependencies/waypoints/js/jquery.waypoints.min.js"></script>
<!-- Counterup Js -->
<script src="dependencies/jquery.counterup/js/jquery.counterup.min.js"></script>
<!-- Owl Carousel Js -->
<script src="dependencies/owl.carousel/js/owl.carousel.min.js"></script>
<!-- ImagesLoaded Js -->
<script src="dependencies/imagesloaded/js/imagesloaded.pkgd.min.js"></script>
<!-- Isotope Js -->
<script src="dependencies/isotope-layout/js/isotope.pkgd.min.js"></script>
<!-- Animated Headline Js -->
<script src="dependencies/jquery-animated-headlines/js/jquery.animatedheadline.min.js"></script>
<!-- Magnific Popup Js -->
<script src="dependencies/magnific-popup/js/jquery.magnific-popup.min.js"></script>
<!-- ElevateZoom Js -->
<script src="dependencies/elevatezoom/js/jquery.elevateZoom-2.2.3.min.js"></script>
<!-- Bootstrap Validate Js -->
<script src="dependencies/bootstrap-validator/js/validator.min.js"></script>
<!-- Meanmenu Js -->
<script src="dependencies/meanmenu/js/jquery.meanmenu.min.js"></script>
<!-- Google Map js -->
<!--    <script src="https://ditu.google.cn/maps/api/js?key=AIzaSyBtmXSwv4YmAKtcZyyad9W7D4AC08z0Rb4"></script>-->
<!-- Site Scripts -->
<script src="assets/js/app.js"></script>

<script th:src="@{js/vue.js}" type="text/javascript"></script>
<script src="js/echarts.js" type="text/javascript"></script>
<script src="js/china.js" type="text/javascript"></script>

<script>
    let vue1=new Vue({
        el:"#header1",
        data:{
            tableSelected:"",
            tableType:[
                {name:"地区生产总值",value:"total_value1"},
                {name:"人口",value:"population1"},
                {name:"人均生产总值",value:"per_value1"},
                {name:"人均工资",value:"salary1"},
                {name:"人均可支配收入",value:"dis_income1"},
                {name:"人均消费支出",value:"consumption1"},
                {name:"高校数",value:"total_school1"},
                {name:"教育经费",value:"edu_fee1"}
            ]
        },
        created(){
            this.tableSelected=this.tableType[0].value;
        },
        methods:{
        }
    });
</script>

<script th:inline="javascript">
    let result0=[[${result}]];
    console.log(result0);
    function submit1() {
        let tableName=vue1.$data.tableSelected;
        $.ajax({
            type: "GET",
            url:"/tableData",
            data:"tableSelected="+tableName,
            datatype: "json",
            success:function (result) {
                if(result){
                    let str="";
                    for(let i=0;i<result.length;i++){
                        str+="<tr>";
                        str+=   "<th style=\"white-space: nowrap\"><button onclick=\"deletetr(this)\">删除</button><button onclick=\"savetr(this)\">保存</button></th>"
                        str+=   "<td class='year'>"+result[i].year+"</td>";
                        str+=   "<td class='beijing'>"+result[i].beijing+"</td>";
                        str+=   "<td class='tianjing'>"+result[i].tianjing+"</td>";
                        str+=   "<td class='hebei'>"+result[i].hebei+"</td>";
                        str+=   "<td class='shanxi'>"+result[i].shanxi+"</td>";
                        str+=   "<td class='neimeng'>"+result[i].neimeng+"</td>";
                        str+=   "<td class='liaoning'>"+result[i].liaoning+"</td>";
                        str+=   "<td class='jilin'>"+result[i].jilin+"</td>";
                        str+=   "<td class='heilongjiang'>"+result[i].heilongjiang+"</td>";
                        str+=   "<td class='shanghai'>"+result[i].shanghai+"</td>";
                        str+=   "<td class='jiangsu'>"+result[i].jiangsu+"</td>";
                        str+=   "<td class='zhejiang'>"+result[i].zhejiang+"</td>";
                        str+=   "<td class='anhui'>"+result[i].anhui+"</td>";
                        str+=   "<td class='fujian'>"+result[i].fujian+"</td>";
                        str+=   "<td class='jiangxi'>"+result[i].jiangxi+"</td>";
                        str+=   "<td class='shandong'>"+result[i].shandong+"</td>";
                        str+=   "<td class='henan'>"+result[i].henan+"</td>";
                        str+=   "<td class='hubei'>"+result[i].hubei+"</td>";
                        str+=   "<td class='hunan'>"+result[i].hunan+"</td>";
                        str+=   "<td class='guangdong'>"+result[i].guangdong+"</td>";
                        str+=   "<td class='guangxi'>"+result[i].guangxi+"</td>";
                        str+=   "<td class='hainan'>"+result[i].hainan+"</td>";
                        str+=   "<td class='chongqin'>"+result[i].chongqin+"</td>";
                        str+=   "<td class='sichuan'>"+result[i].sichuan+"</td>";
                        str+=   "<td class='guizhou'>"+result[i].guizhou+"</td>";
                        str+=   "<td class='yunnan'>"+result[i].yunnan+"</td>";
                        str+=   "<td class='xizang'>"+result[i].xizang+"</td>";
                        str+=   "<td class='shaanxi'>"+result[i].shaanxi+"</td>";
                        str+=   "<td class='gansu'>"+result[i].gansu+"</td>";
                        str+=   "<td class='qinhai'>"+result[i].qinhai+"</td>";
                        str+=   "<td class='ningxia'>"+result[i].ningxia+"</td>";
                        str+=   "<td class='xinjiang'>"+result[i].xinjiang+"</td>";
                        str+="</tr>";
                    }
                    $("#tbody").html(str);
                    addInput();
                    console.log(result);
                }
            }
        });
    }

    function addRow() {
        let str="<tr>";
        str+=   "<th style=\"white-space: nowrap\"><button onclick=\"deletetr(this)\">删除</button><button onclick=\"savetr(this)\">保存</button></th>";
        str+=   "<td class='year'></td>";
        str+=   "<td class='beijing'></td>";
        str+=   "<td class='tianjing'></td>";
        str+=   "<td class='hebei'></td>";
        str+=   "<td class='shanxi'></td>";
        str+=   "<td class='neimeng'></td>";
        str+=   "<td class='liaoning'></td>";
        str+=   "<td class='jilin'></td>";
        str+=   "<td class='heilongjiang'></td>";
        str+=   "<td class='shanghai'></td>";
        str+=   "<td class='jiangsu'></td>";
        str+=   "<td class='zhejiang'></td>";
        str+=   "<td class='anhui'></td>";
        str+=   "<td class='fujian'></td>";
        str+=   "<td class='jiangxi'></td>";
        str+=   "<td class='shandong'></td>";
        str+=   "<td class='henan'></td>";
        str+=   "<td class='hubei'></td>";
        str+=   "<td class='hunan'></td>";
        str+=   "<td class='guangdong'></td>";
        str+=   "<td class='guangxi'></td>";
        str+=   "<td class='hainan'></td>";
        str+=   "<td class='chongqin'></td>";
        str+=   "<td class='sichuan'></td>";
        str+=   "<td class='guizhou'></td>";
        str+=   "<td class='yunnan'></td>";
        str+=   "<td class='xizang'></td>";
        str+=   "<td class='shaanxi'></td>";
        str+=   "<td class='gansu'></td>";
        str+=   "<td class='qinhai'></td>";
        str+=   "<td class='ningxia'></td>";
        str+=   "<td class='xinjiang'></td>";
        str+="</tr>";
        $("#tbody").append(str);

        addInput();
    }

    function deletetr(nowBtn) {
        let tableName=vue1.$data.tableSelected;
        let year=$(nowBtn).parents("tr").find(".year").text();
        $.ajax({
            type: "GET",
            url: "/delete",
            traditional: true,
            data: {
                tableName: tableName,
                year: year
            },
            //解决ajax中文乱码
            contentType: "application/json; charset=utf-8",
            success: function (data) {
                if(data==1){
                    alert("success");
                }
            },
            error: function (xhr, status, errMsg) {
                //执行Servlet失败执行下面数据
                alert("error");
            }
        });

        $(nowBtn).parent().parent().remove();
    }

    function savetr(nowbtn){
        let tableName=vue1.$data.tableSelected;

        let year=$(nowbtn).parents("tr").find(".year").text();
        let beijing=$(nowbtn).parents("tr").find(".beijing").text();
        let tianjing=$(nowbtn).parents("tr").find(".tianjing").text();
        let hebei=$(nowbtn).parents("tr").find(".hebei").text();
        let shanxi=$(nowbtn).parents("tr").find(".shanxi").text();
        let neimeng=$(nowbtn).parents("tr").find(".neimeng").text();
        let liaoning=$(nowbtn).parents("tr").find(".liaoning").text();
        let jilin=$(nowbtn).parents("tr").find(".jilin").text();
        let heilongjiang=$(nowbtn).parents("tr").find(".heilongjiang").text();
        let shanghai=$(nowbtn).parents("tr").find(".shanghai").text();
        let jiangsu=$(nowbtn).parents("tr").find(".jiangsu").text();
        let zhejiang=$(nowbtn).parents("tr").find(".zhejiang").text();
        let anhui=$(nowbtn).parents("tr").find(".anhui").text();
        let fujian=$(nowbtn).parents("tr").find(".fujian").text();
        let jiangxi=$(nowbtn).parents("tr").find(".jiangxi").text();
        let shandong=$(nowbtn).parents("tr").find(".shandong").text();
        let henan=$(nowbtn).parents("tr").find(".henan").text();
        let hubei=$(nowbtn).parents("tr").find(".hubei").text();
        let hunan=$(nowbtn).parents("tr").find(".hunan").text();
        let guangdong=$(nowbtn).parents("tr").find(".guangdong").text();
        let guangxi=$(nowbtn).parents("tr").find(".guangxi").text();
        let hainan=$(nowbtn).parents("tr").find(".hainan").text();
        let chongqin=$(nowbtn).parents("tr").find(".chongqin").text();
        let sichuan=$(nowbtn).parents("tr").find(".sichuan").text();
        let guizhou=$(nowbtn).parents("tr").find(".guizhou").text();
        let yunnan=$(nowbtn).parents("tr").find(".yunnan").text();
        let xizang=$(nowbtn).parents("tr").find(".xizang").text();
        let shaanxi=$(nowbtn).parents("tr").find(".shaanxi").text();
        let gansu=$(nowbtn).parents("tr").find(".gansu").text();
        let qinhai=$(nowbtn).parents("tr").find(".qinhai").text();
        let ningxia=$(nowbtn).parents("tr").find(".ningxia").text();
        let xinjiang=$(nowbtn).parents("tr").find(".xinjiang").text();

        $.ajax({
            type : "GET",
            url : "/save",
            traditional: true,
            data : {
                tableName:tableName,
                year:year,
                beijing:beijing,
                tianjing:tianjing,
                hebei:hebei,
                shanxi:shanxi,
                neimeng:neimeng,
                liaoning:liaoning,
                jilin:jilin,
                heilongjiang:heilongjiang,
                shanghai:shanghai,
                jiangsu:jiangsu,
                zhejiang:zhejiang,
                anhui:anhui,
                fujian:fujian,
                jiangxi:jiangxi,
                shandong:shandong,
                henan:henan,
                hubei:hubei,
                hunan:hunan,
                guangdong:guangdong,
                guangxi:guangxi,
                hainan:hainan,
                chongqin:chongqin,
                sichuan:sichuan,
                guizhou:guizhou,
                yunnan:yunnan,
                xizang:xizang,
                shaanxi:shaanxi,
                gansu:gansu,
                qinhai:qinhai,
                ningxia:ningxia,
                xinjiang:xinjiang,
            },
            //解决ajax中文乱码
            contentType: "application/json; charset=utf-8",
            success : function(data) {
                alert("success");
            },
            error : function(xhr, status, errMsg) {
                //执行Servlet失败执行下面数据
                alert("error");
            }
        });
    }

    function addInput(){
        $('table td').dblclick(function(){
            if(!$(this).is('.input')){
                $(this).addClass('input').html('<input type="text" value="'+ $(this).text() +'" />').find('input').focus().blur(function(){
                    $(this).parent().removeClass('input').html($(this).val() || 0);
                });
            }
        }).hover(function(){
            $(this).addClass('hover');
        },function(){
            $(this).removeClass('hover');
        });
    }

    addInput();

</script>

</body>

</html>